<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>扫码点餐</title>
		<link rel="stylesheet" href="./css/index.css" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" />
		<script src="js/v3.2.8/vue.global.prod.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.js"></script>
		<script src="js/request.js"></script>
	</head>
	<body>
		<div id="app">
			<div class="ng-scope">
				<header class="ng-scope">
					<h4 class="title-order">
						<a class="title-top" href="member.html">我的订单</a>
					</h4>
				</header>
				<div class="cartempty ng-scope" v-if="list.length==0">
					<h3>亲，订单空空的呢~</h3>
					<a href="index.html">去逛逛</a>
				</div>
				<div class="orderlist">
					<ul class="lists ng-scope">
						<li v-for="v in list" :key="v.OrderNo">
							<p>{{v.CreateDate}} - {{v.CDefault6}} <span class="status">{{v.StatusName}}</span></p>
							<p>订单编号：{{v.OrderNo}}</p>
							<p>商品数量：{{v.Amount}}</p>
							<ul class="pdtlist">
								<li v-for="c in v.Data" :key="c.GoodsNo">
									<div class="l">
										<img :src="imgUrl+c.CDefault8" class="img-responsive" alt="...">
									</div>
									<div class="r">
										<p class="t">{{c.GoodsName}}</p>
										<p class="money">￥{{c.OrderPrice}} x {{c.FNum}}</p>
										<!-- <p class="jf">商品总价：{{}}</p> -->
									</div>
								</li>
							</ul>
							<div class="bottom">
								<p class="money">实付：￥{{v.OrderPrice}}元</p>
								<!-- <a href="javascript:;">删除记录</a> -->
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<script>
			const App = {
				data() {
					return {
						list: [],
						imgUrl
					}
				},
				created() {
					this.GetOrder()
				},
				methods: {
					// 查询订单
					GetOrder() {
						http('/api/goods/GetOrder?type=餐厅订单&OpenId=' + localStorage.getItem('openid'), {}, (r) => {
							this.list = r
						})
					},
				}
			};
			Vue.createApp(App).mount('#app');
		</script>
	</body>
</html>